import 'package:flutter/material.dart';

/// 响应式布局工具类 - Responsive Layout Utility
/// 提供跨平台自适应布局支持
class ResponsiveLayout extends StatelessWidget {
  final Widget mobile;
  final Widget? tablet;
  final Widget? desktop;
  final double mobileBreakpoint;
  final double tabletBreakpoint;

  const ResponsiveLayout({
    super.key,
    required this.mobile,
    this.tablet,
    this.desktop,
    this.mobileBreakpoint = 600,
    this.tabletBreakpoint = 1200,
  });

  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(
      builder: (context, constraints) {
        if (constraints.maxWidth >= tabletBreakpoint) {
          return desktop ?? tablet ?? mobile;
        } else if (constraints.maxWidth >= mobileBreakpoint) {
          return tablet ?? mobile;
        } else {
          return mobile;
        }
      },
    );
  }

  /// 获取当前设备类型 - Get Current Device Type
  static DeviceType getDeviceType(BuildContext context) {
    final width = MediaQuery.of(context).size.width;
    if (width >= 1024) {
      return DeviceType.desktop;
    } else if (width >= 600) {
      return DeviceType.tablet;
    } else {
      return DeviceType.mobile;
    }
  }

  /// 判断是否为移动设备 - Check if Mobile Device
  static bool isMobile(BuildContext context) {
    return getDeviceType(context) == DeviceType.mobile;
  }

  /// 判断是否为平板设备 - Check if Tablet Device
  static bool isTablet(BuildContext context) {
    return getDeviceType(context) == DeviceType.tablet;
  }

  /// 判断是否为桌面设备 - Check if Desktop Device
  static bool isDesktop(BuildContext context) {
    return getDeviceType(context) == DeviceType.desktop;
  }

  /// 获取响应式值 - Get Responsive Value
  static T getValue<T>(
    BuildContext context, {
    required T mobile,
    T? tablet,
    T? desktop,
  }) {
    final deviceType = getDeviceType(context);
    switch (deviceType) {
      case DeviceType.desktop:
        return desktop ?? tablet ?? mobile;
      case DeviceType.tablet:
        return tablet ?? mobile;
      case DeviceType.mobile:
        return mobile;
    }
  }

  /// 获取响应式边距 - Get Responsive Padding
  static EdgeInsets getResponsivePadding(BuildContext context) {
    return getValue(
      context,
      mobile: const EdgeInsets.all(16),
      tablet: const EdgeInsets.all(24),
      desktop: const EdgeInsets.all(32),
    );
  }

  /// 获取响应式间距 - Get Responsive Spacing
  static double getResponsiveSpacing(BuildContext context) {
    return getValue(
      context,
      mobile: 16.0,
      tablet: 24.0,
      desktop: 32.0,
    );
  }

  /// 获取响应式字体大小 - Get Responsive Font Size
  static double getResponsiveFontSize(
    BuildContext context, {
    required double mobile,
    double? tablet,
    double? desktop,
  }) {
    return getValue(
      context,
      mobile: mobile,
      tablet: tablet,
      desktop: desktop,
    );
  }

  /// 获取响应式列数 - Get Responsive Column Count
  static int getResponsiveColumns(BuildContext context) {
    return getValue(
      context,
      mobile: 1,
      tablet: 2,
      desktop: 3,
    );
  }

  /// 获取响应式网格列数 - Get Responsive Grid Columns
  static int getResponsiveGridColumns(BuildContext context) {
    return getValue(
      context,
      mobile: 2,
      tablet: 3,
      desktop: 4,
    );
  }

  /// 获取响应式卡片宽度 - Get Responsive Card Width
  static double getResponsiveCardWidth(BuildContext context) {
    final screenWidth = MediaQuery.of(context).size.width;
    return getValue(
      context,
      mobile: screenWidth - 32,
      tablet: (screenWidth - 64) / 2,
      desktop: (screenWidth - 96) / 3,
    );
  }

  /// 获取响应式对话框宽度 - Get Responsive Dialog Width
  static double getResponsiveDialogWidth(BuildContext context) {
    final screenWidth = MediaQuery.of(context).size.width;
    return getValue(
      context,
      mobile: screenWidth * 0.9,
      tablet: screenWidth * 0.7,
      desktop: screenWidth * 0.5,
    ).clamp(300.0, 800.0);
  }

  /// 获取响应式侧边栏宽度 - Get Responsive Sidebar Width
  static double getResponsiveSidebarWidth(BuildContext context) {
    return getValue(
      context,
      mobile: 280.0,
      tablet: 320.0,
      desktop: 360.0,
    );
  }

  /// 获取响应式应用栏高度 - Get Responsive AppBar Height
  static double getResponsiveAppBarHeight(BuildContext context) {
    return getValue(
      context,
      mobile: kToolbarHeight,
      tablet: kToolbarHeight + 8,
      desktop: kToolbarHeight + 16,
    );
  }

  /// 获取响应式图标大小 - Get Responsive Icon Size
  static double getResponsiveIconSize(BuildContext context) {
    return getValue(
      context,
      mobile: 24.0,
      tablet: 28.0,
      desktop: 32.0,
    );
  }

  /// 获取响应式按钮高度 - Get Responsive Button Height
  static double getResponsiveButtonHeight(BuildContext context) {
    return getValue(
      context,
      mobile: 48.0,
      tablet: 52.0,
      desktop: 56.0,
    );
  }

  /// 获取响应式输入框高度 - Get Responsive Input Height
  static double getResponsiveInputHeight(BuildContext context) {
    return getValue(
      context,
      mobile: 48.0,
      tablet: 52.0,
      desktop: 56.0,
    );
  }

  /// 获取响应式卡片圆角 - Get Responsive Card Radius
  static double getResponsiveCardRadius(BuildContext context) {
    return getValue(
      context,
      mobile: 8.0,
      tablet: 12.0,
      desktop: 16.0,
    );
  }

  /// 获取响应式阴影 - Get Responsive Shadow
  static List<BoxShadow> getResponsiveShadow(BuildContext context) {
    final elevation = getValue(
      context,
      mobile: 2.0,
      tablet: 4.0,
      desktop: 8.0,
    );

    return [
      BoxShadow(
        color: Colors.black.withOpacity(0.1),
        blurRadius: elevation,
        offset: Offset(0, elevation / 2),
      ),
    ];
  }

  /// 获取响应式网格配置 - Get Responsive Grid Configuration
  static SliverGridDelegate getResponsiveGridDelegate(BuildContext context) {
    final columns = getResponsiveGridColumns(context);
    final spacing = getResponsiveSpacing(context);

    return SliverGridDelegateWithFixedCrossAxisCount(
      crossAxisCount: columns,
      crossAxisSpacing: spacing,
      mainAxisSpacing: spacing,
      childAspectRatio: getValue(
        context,
        mobile: 0.8,
        tablet: 0.9,
        desktop: 1.0,
      ),
    );
  }

  /// 获取响应式列表配置 - Get Responsive List Configuration
  static EdgeInsets getResponsiveListPadding(BuildContext context) {
    return getValue(
      context,
      mobile: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      tablet: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
      desktop: const EdgeInsets.symmetric(horizontal: 32, vertical: 16),
    );
  }

  /// 获取响应式分隔线 - Get Responsive Divider
  static Widget getResponsiveDivider(BuildContext context) {
    final thickness = getValue(
      context,
      mobile: 1.0,
      tablet: 1.5,
      desktop: 2.0,
    );

    return Divider(
      thickness: thickness,
      color: Colors.grey.withOpacity(0.3),
    );
  }

  /// 获取响应式间隔组件 - Get Responsive Spacing Widget
  static Widget getResponsiveSpacingWidget(BuildContext context) {
    final spacing = getResponsiveSpacing(context);
    return SizedBox(height: spacing, width: spacing);
  }

  /// 获取响应式小间隔组件 - Get Responsive Small Spacing Widget
  static Widget getResponsiveSmallSpacingWidget(BuildContext context) {
    final spacing = getResponsiveSpacing(context) / 2;
    return SizedBox(height: spacing, width: spacing);
  }

  /// 获取响应式大间隔组件 - Get Responsive Large Spacing Widget
  static Widget getResponsiveLargeSpacingWidget(BuildContext context) {
    final spacing = getResponsiveSpacing(context) * 1.5;
    return SizedBox(height: spacing, width: spacing);
  }

  /// 构建响应式容器 - Build Responsive Container
  static Widget buildResponsiveContainer(
    BuildContext context, {
    required Widget child,
    Color? backgroundColor,
    bool addPadding = true,
    bool addShadow = false,
  }) {
    return Container(
      width: double.infinity,
      padding: addPadding ? getResponsivePadding(context) : null,
      decoration: BoxDecoration(
        color: backgroundColor ?? Theme.of(context).cardColor,
        borderRadius: BorderRadius.circular(getResponsiveCardRadius(context)),
        boxShadow: addShadow ? getResponsiveShadow(context) : null,
      ),
      child: child,
    );
  }

  /// 构建响应式卡片 - Build Responsive Card
  static Widget buildResponsiveCard(
    BuildContext context, {
    required Widget child,
    VoidCallback? onTap,
    bool addShadow = true,
  }) {
    return Card(
      elevation: addShadow ? getValue(context, mobile: 2.0, tablet: 4.0, desktop: 8.0) : 0,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(getResponsiveCardRadius(context)),
      ),
      child: InkWell(
        onTap: onTap,
        borderRadius: BorderRadius.circular(getResponsiveCardRadius(context)),
        child: Padding(
          padding: getResponsivePadding(context),
          child: child,
        ),
      ),
    );
  }

  /// 构建响应式按钮 - Build Responsive Button
  static Widget buildResponsiveButton(
    BuildContext context, {
    required String text,
    required VoidCallback onPressed,
    bool isPrimary = true,
    IconData? icon,
  }) {
    final height = getResponsiveButtonHeight(context);
    final fontSize = getResponsiveFontSize(context, mobile: 14, tablet: 16, desktop: 18);

    Widget button = SizedBox(
      height: height,
      child: icon != null
          ? ElevatedButton.icon(
              onPressed: onPressed,
              icon: Icon(icon, size: getResponsiveIconSize(context)),
              label: Text(text, style: TextStyle(fontSize: fontSize)),
              style: ElevatedButton.styleFrom(
                backgroundColor: isPrimary ? null : Colors.grey[200],
                foregroundColor: isPrimary ? null : Colors.black87,
              ),
            )
          : ElevatedButton(
              onPressed: onPressed,
              style: ElevatedButton.styleFrom(
                backgroundColor: isPrimary ? null : Colors.grey[200],
                foregroundColor: isPrimary ? null : Colors.black87,
              ),
              child: Text(text, style: TextStyle(fontSize: fontSize)),
            ),
    );

    return button;
  }
}

/// 设备类型枚举 - Device Type Enum
enum DeviceType {
  mobile,
  tablet,
  desktop,
}

/// 响应式构建器 - Responsive Builder
class ResponsiveBuilder extends StatelessWidget {
  final Widget Function(BuildContext context, DeviceType deviceType) builder;

  const ResponsiveBuilder({
    super.key,
    required this.builder,
  });

  @override
  Widget build(BuildContext context) {
    final deviceType = ResponsiveLayout.getDeviceType(context);
    return builder(context, deviceType);
  }
}

/// 响应式网格视图 - Responsive Grid View
class ResponsiveGridView extends StatelessWidget {
  final List<Widget> children;
  final double? childAspectRatio;
  final EdgeInsets? padding;
  final ScrollPhysics? physics;

  const ResponsiveGridView({
    super.key,
    required this.children,
    this.childAspectRatio,
    this.padding,
    this.physics,
  });

  @override
  Widget build(BuildContext context) {
    return GridView.builder(
      padding: padding ?? ResponsiveLayout.getResponsiveListPadding(context),
      physics: physics,
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: ResponsiveLayout.getResponsiveGridColumns(context),
        crossAxisSpacing: ResponsiveLayout.getResponsiveSpacing(context),
        mainAxisSpacing: ResponsiveLayout.getResponsiveSpacing(context),
        childAspectRatio: childAspectRatio ?? 
            ResponsiveLayout.getValue(
              context,
              mobile: 0.8,
              tablet: 0.9,
              desktop: 1.0,
            ),
      ),
      itemCount: children.length,
      itemBuilder: (context, index) => children[index],
    );
  }
}

/// 响应式列表视图 - Responsive List View
class ResponsiveListView extends StatelessWidget {
  final List<Widget> children;
  final EdgeInsets? padding;
  final ScrollPhysics? physics;
  final bool shrinkWrap;

  const ResponsiveListView({
    super.key,
    required this.children,
    this.padding,
    this.physics,
    this.shrinkWrap = false,
  });

  @override
  Widget build(BuildContext context) {
    return ListView.separated(
      padding: padding ?? ResponsiveLayout.getResponsiveListPadding(context),
      physics: physics,
      shrinkWrap: shrinkWrap,
      itemCount: children.length,
      separatorBuilder: (context, index) => 
          ResponsiveLayout.getResponsiveSmallSpacingWidget(context),
      itemBuilder: (context, index) => children[index],
    );
  }
}